<template>
  <div class="mid-autumn">
    <img src="@/assets/mid-autumn.jpg" alt="">
    <img src="@/assets/title_mid-autumn.jpg" alt="">
    <good-item v-for="(item,index) in goodList" :key="index" :info="item" />
    <shade v-if="shadeShow" />
    <div class="copyright">
      <p>备案号：闽ICP备17029405号</p>
      <p>Copyright ©2017 chamiw.com</p>
    </div>
  </div>
</template>

<script>
import wx from "weixin-js-sdk";
import login from "@/utils/login";
import getCode from "@/utils/getCode";
import goodItem from "./components/goodItem";
import { getGoodList } from "@/api/mid-autumn";
import { countView, getGood, wxCodeLogin, getSign } from "@/api/index";
import getUrlParams from "@/utils/getUrlParams.js";
export default {
  data() {
    return {
      goodList: [],
      shadeShow: true,
      urlParams: {
        good_id: "",
        username: "",
        ad: "",
        platform: ""
      },
      code: "",
      title: "",
      description: "",
      kefu_tel: "",
      imgUrl: ""
    };
  },
  created() {
    getUrlParams(this);
    getGood(this.urlParams.good_id).then(result => {
      this.title = result.data.name;
      this.description = result.data.feature;
      this.imgUrl = result.data.image;
      this.$store.commit("SETPAGEINFO", {
        title: this.title,
        description: this.description
      });
    });
    login(this);
    getCode(this);
    wxCodeLogin(this.code).then(result => {});
    getSign(location.href.split("#")[0]).then(res => {
      wx.config({
        debug: false, // 开启调试模式,调用的所有api的返回值会在客户端alert出来，若要查看传入的参数，可以在pc端打开，参数信息会通过log打出，仅在pc端时才会打印。
        appId: res.data.appId, // 必填，公众号的唯一标识
        timestamp: res.data.timestamp, // 必填，生成签名的时间戳
        nonceStr: res.data.nonceStr, // 必填，生成签名的随机串
        signature: res.data.signature, // 必填，签名
        jsApiList: ["onMenuShareTimeline", "onMenuShareAppMessage"] // 必填，需要使用的JS接口列表
      });
      wx.ready(() => {
        wx.onMenuShareTimeline({
          title: this.title, // 分享标题
          link: location.href, // 分享链接，该链接域名或路径必须与当前页面对应的公众号JS安全域名一致
          imgUrl: this.imgUrl, // 分享图标
          success: function() {
            // 用户点击了分享后执行的回调函数
            // mui.alert("分享朋友圈成功");
          },
          cancel: function() {
            // mui.alert("您确定不分享了吗？");
          }
        });
        wx.onMenuShareAppMessage({
          title: this.title, // 分享标题
          desc: this.description, // 分享描述
          link: location.href, // 分享链接，该链接域名或路径必须与当前页面对应的公众号JS安全域名一致
          imgUrl: this.imgUrl, // 分享图标
          type: "", // 分享类型,music、video或link，不填默认为link
          dataUrl: "", // 如果type是music或video，则要提供数据链接，默认为空
          success: function() {
            // 用户点击了分享后执行的回调函数
            // mui.alert("分享给好友成功");
          },
          cancel: function() {
            // mui.alert("取消分享");
          }
        });
      });
      wx.error(function(res) {
        // alert(res);
        // config信息验证失败会执行error函数，如签名过期导致验证失败，具体错误信息可以打开config的debug模式查看，也可以在返回的res参数中查看，对于SPA可以在这里更新签名。
      });
    });
    this.$store.commit("SETURLPARAMS", this.urlParams);
    getGoodList(17).then(result => {
      this.goodList = result.data;
      this.shadeShow = false;
    });
    var view = this.urlParams;
    view.page_url = location.href;
    view.pid = this.urlParams.good_id;
    countView(view).then(result => {
      this.$store.commit("SETKEFUTEL", result.data.service_tel);
      this.kefu_tel = result.data.service_tel;
    });
  },
  components: {
    goodItem
  }
};
</script>

<style lang="scss" scoped>
@import '@/style/base.scss';
.mid-autumn {
  img {
    width: 100%;
    display: block;
    pointer-events: none;
  }
  .copyright {
    margin-top: to(15);
    padding: to(8) 0;
    background-color: #fff;
    p {
      text-align: center;
      color: #666;
      font-size: to(20);
      line-height: to(40);
      &:nth-child(2) {
        font-size: to(18);
        color: #999;
        line-height: to(30);
      }
    }
  }
}
</style>
